<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.header{
				width: 1920px;
				height: 800px;
			}
			.header1{
				width: 1920px;
				height: 435px;
				background-color: black;
			}
			.HeaderLogo{
				width: 1190px;
				height: 74px;
				line-height: 74px;
				margin-left: 370px;
			}
			.headerText{
				float: right;
			}
			.HeaderLogo1{
				float: left;
			}
			div div div a{
				color: white;
				margin-left:40px;
				text-decoration: none;
			}
			a:hover{
				color: red;
			}
			.HeaderImg{
				width: 1190px;
				height: 480px;
				position: absolute;
				left: 370px;
				border-radius: 10px;
				/*将元素优先级调整回原来的优先级
				 显示优先级属性：z-index,属性值是整数
				 所有的元素初始显示优先级都是0
				 只能给添加定位的元素使用
				 z-index: 0;
				 绝对定位会将元素显示的优先级提升一级*/
			}
			.header2{
				height: 245px;
				width: 1920px;
				text-align: center;
				margin-top: 120px;
			}
			.headerText2{
				padding-top: 82px;
			}
			div div p{
				
				/*黄金行高，高度21px*/
				color:grey;
				font-size: 14px;
				line-height: 21px;
			}
			div div span{
				font-weight: bold;
				font-size: 18px;
			}
			.yp_ywl{
				width: 1920px;
				height: 510px;
				background-image: url(img/yp_bg_03_02.gif);
			}
			.yp_ywl_img1{
				padding-top: 60px;
			}
			
		</style>
	</head>
	<!--
        	leftmargom="0px"针对body标签左边初始边距的设定
        	将初始边距设定为0px
    -->
	<body leftmargin="0px">
		<!--
        	装整个页面的div
      -->
      <div>
      	<!--
      		页头部分，页面logo，导航条，轮播图，欢迎页
          	时间：2021-05-06
          	负责人：Noble
          -->
          <div class="header">
          	<div class="header1">
          		<div class="HeaderLogo">
          			<div class="HeaderLogo1">
          				<img src="img/yp_03.gif"/>
          			</div>
          			<div class="headerText">
          				<a href="#">网站首页</a>
          			    <a href="#">产品展示</a>
          			    <a href="#">关于我们</a>
          			    <a href="#">新闻中心</a>
          			    <a href="#">联系我们</a>
          			</div>
          		</div>
          		<div class="HeaderImg">
          			<img width="1190px" height="480" src="img/yp_09.gif"/>
          		</div>
          	</div>
          	<div class="header2">
          		<div class="headerText2">
          			<span>欢迎访问羿品建筑</span>
          			<p>羿品建筑是一家以建筑设计、室内设计、环境艺术设计为</p>
          			<p>主营业务的工业设计机构</p>
          		</div>
          	</div>
          	
          </div>
          <!--
          	作者：offline
          	时间：2021-05-08
          	描述：业务类型模块
          -->
          <div class="yp_ywl">
          	<div class="yp_ywl_img1">
          		<img src="img/yp-icon_03.gif"/>
          		<h3>项目类型</h3>
          	</div>
          </div>
          
      </div>
	</body>
</html>